<template>
  <div>
    <SectionContainer title="表单、表格、弹窗demo">
      <demo-form @query="handleQuery" />
      <demo-table :table-data="tableData" :page="page" @pageSize="handlePageSize" />
    </SectionContainer>
  </div>
</template>

<script>
import DemoForm from './components/form.vue'
import DemoTable from './components/table.vue'
import SectionContainer from '@/components/SectionContainer'
export default {
  components: {
    DemoForm,
    DemoTable,
    SectionContainer
  },
  data() {
    return {
      tableData: [
        {
          name: 'tom',
          age: 10
        }
      ],
      page: {
        page: 1,
        size: 10,
        total: 1
      }
    }
  },
  methods: {
    handleQuery(obj) {
      console.log('query:', obj)
    },
    // 表格分页
    handlePageSize(page, size) {
      this.page.page = page
      this.page.size = size
    }
  }
}
</script>

